<template>
  <div class="mine">
    <my-header :userinfo="userinfo"/>
    <my-member/>
    <my-integral-card :userinfo="userinfo"/>
    <my-activation-code/>
    <my-player-service/>
    <my-more/>
  </div>
</template>

<script>
import MyActivationCode from './childComps/MyActivationCode.vue'
import MyHeader from './childComps/MyHeader.vue'
import MyIntegralCard from './childComps/MyIntegralCard.vue'
import MyMember from './childComps/MyMember.vue'
import MyMore from './childComps/MyMore.vue'
import MyPlayerService from './childComps/MyPlayerService.vue'
export default {
  components: {
    MyHeader,
    MyMember,
    MyIntegralCard,
    MyActivationCode,
    MyPlayerService,
    MyMore,
  },
  data() {
    return {
      userinfo: {},
    }
  },
  created () {
    this.getUserInfo()
  },
  methods: {
    getUserInfo() {
      this.axios.get('/userinfo.json', {}).then(res => {
        this.userinfo = res.data.userinfo
      })
    }
  },
}
</script>

<style lang="less" scoped>
.mine {
  position: fixed;
  width: 10rem;
  overflow: auto;
  top: 0;
  bottom: 1.306667rem;
  left: 50%;
  transform: translateX(-50%);
}

.mine::-webkit-scrollbar {
  display:none
}
</style>
